<template>
  <div class="noResources">
    <div class="imgBox">
      <img :src="noImg" alt="">
    </div>
    <div class="imgBox imgBoxCore">
      <div class="num">404</div>
      <div class="info">访问地址不存在</div>
      <div class="link" @click="goback">返回首页 &gt;&gt;</div>
    </div>
  </div>
</template>
<script type="text/ecmascript-6">
import noImg from '@/assets/images/404.png'
export default {
  name: 'noResources',
  data () {
    return {
      noImg
    }
  },
  methods: {
    goback () {
      this.$router.push({ name: 'admin' })
    }
  }
}
</script>
<style lang="stylus" rel="stylesheet/stylus" scoped>
@import '../../../assets/stylus/variable'
.noResources
  position fixed
  width 100%
  height 100%
  top 0
  display flex
  justify-content center
  align-items center
  .imgBox
    height 200px
    &:first-child
      margin-right 100px
    &.imgBoxCore
      display flex
      flex-direction column
      .num
        font-size 100px
        color #FB8021
        letter-spacing 40px
      .info
        margin-top $spacing
        font-size 24px
        color $color-text
      .link
        color $color-theme
        margin-top $spacing
        font-size 20px
        cursor pointer
</style>
